/* 主頁 */
.custom-main{
	min-height: 800px;
}
  
/* 文章區塊 */
.custom-post-area{
	background-color:#f8f8fd;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4),0 0 30px rgba(10,10,0,0.1) inset;
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4),0 0 30px rgba(10,10,0,0.1) inset;
	-o-box-shadow: 0 1px 2px rgba(0,0,0,0.4),0 0 30px rgba(10,10,0,0.1) inset;
	box-shadow: 0 1px 2px rgba(0,0,0,0.4),0 0 30px rgba(10,10,0,0.1) inset;
}

/* 標誌設定（48）*/
.custom-icon-48 svg {
    display: inline-block;
    width: 48px;
    height: 48px;
    vertical-align: text-bottom;
}

/* 標誌設定（16）*/
.custom-icon-16 svg {
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: middle;
}

.custom-navbar-subtitle{
	color: whitesmoke;
	opacity:0.8;
	font-size: 14px;
  }

.custom-post-list-header{
	padding: 15px 30px;
	border-bottom: 1px solid #c0c0c0;
	font-size: 30px;
	font-weight: bold;
}

/* post-list-item */
.custom-post-list-item{
	display: block;
	padding:8px 30px 10px 30px; 
	border-bottom:1px solid #ddd;

	transition:0.4s ease; 
	-webkit-transition:0.4s ease;
	-moz-transition:0.4s ease;
	-o-transition:0.4s ease;
}

.custom-post-list-item:last-of-type{
	border-bottom: none;
}

.custom-post-list-item h2{
	font-size: 20px;
	margin: 8px 0 8px 0;
	padding: 0;
}

.custom-post-list-item:hover{
	background-color: rgba(0,0,6,0.05);
	
}


/* post
 * post articles area
 */
 .custom-post{
	padding:10px 30px;
	font-size: 16px;
	line-height: 1.5;
	/* -webkit-text-size-adjust: 100%; */
}

.custom-post h4{
	font-weight: bold;
}

.custom-post img{
	max-width: 100%;
    vertical-align: middle;

	-webkit-box-shadow: 0 0 5px 2px rgba(0,0,0,0.1);
	-moz-box-shadow: 0 0 5px 2px rgba(0,0,0,0.1);
	-o-box-shadow: 0 0 5px 2px rgba(0,0,0,0.1);
	box-shadow: 0 0 5px 2px rgba(0,0,0,0.1);
}

/* shadow */
.custom-shadow-corner-curl{
	
	position: relative;
	background-color:#f8f8fd; 
	-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.4),0 0 20px rgba(0,0,0,0.1) inset;
	-moz-box-shadow: 0 1px 5px rgba(0,0,0,0.4),0 0 20px rgba(0,0,0,0.1) inset;
	-o-box-shadow: 0 1px 5px rgba(0,0,0,0.4),0 0 20px rgba(0,0,0,0.1) inset;
	box-shadow: 0 1px 5px rgba(0,0,0,0.4),0 0 20px rgba(0,0,0,0.1) inset;
}
.custom-shadow-corner-curl:before{
	content:"";
	position: absolute;
	z-index: -5;
	width: 70%;
	height:70%;
	left: 9%;
	bottom: 2%;
	background: transparent;
	-webkit-box-shadow: 0 8px 20px rgba(0,0,0,0.6);
	-moz-box-shadow: 0 8px 20px rgba(0,0,0,0.6);
	-o-box-shadow: 0 8px 20px rgba(0,0,0,0.6);
	box-shadow: 0 8px 20px rgba(0,0,0,0.6);

	/* 向左倾斜12度，再旋转4度 */
	-webkit-transform:skew(-11deg) rotate(-4deg);
	-moz-transform:skew(-11deg) rotate(-4deg);
	-o-transform:skew(-11deg) rotate(-4deg);
	-ms-transform:skew(-11deg) rotate(-4deg);
	transform:skew(-11deg) rotate(-4deg);
}
.custom-shadow-corner-curl:after{
	content:"";
	position: absolute;
	z-index: -5;
	width: 70%;
	height:70%;
	right: 9%;
	bottom: 2%;
	background: transparent;
	-webkit-box-shadow: 0 8px 20px rgba(0,0,0,0.6);
	-moz-box-shadow: 0 8px 20px rgba(0,0,0,0.6);
	-o-box-shadow: 0 8px 20px rgba(0,0,0,0.6);
	box-shadow: 0 8px 20px rgba(0,0,0,0.6);

	/* 向左倾斜12度，再旋转4度 */
	-webkit-transform:skew(11deg) rotate(4deg);
	-moz-transform:skew(11deg) rotate(4deg);
	-o-transform:skew(11deg) rotate(4deg);
	-ms-transform:skew(11deg) rotate(4deg);
	transform:skew(11deg) rotate(4deg);
}

/* categories list */
.custom-categories-list-header {
	display: block;
	padding: 12px 15px;
	border-bottom: 1px solid #c0c0c0;
	font-size: 16px;
	font-weight: bold;
}
.custom-categories-list-item{
	display: block;
	padding:8px 15px; 
	border-bottom:1px solid #ddd; 

	transition:0.4s ease;
	-webkit-transition:0.4s ease;
	-moz-transition:0.4s ease;
	-o-transition:0.4s ease;
}
.custom-categories-list-item:last-of-type{
	border-bottom:none; 
}
.custom-categories-list-item:hover{
	background-color: rgba(0,0,10,0.075);
	color: #983;
}
.custom-categories-list-item .custom-my-badge{
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	background-color: #999;
	padding: 0 7px 1px 7px;
	border-radius: 9px;
	float: right;
	transition:0.4s ease;
	-webkit-transition:0.4s ease;
	-moz-transition:0.4s ease;
	-o-transition:0.4s ease;
}
.custom-categories-list-item:hover .custom-my-badge{
	-webkit-transform:rotate(360deg) scale(1.2);
	-moz-transform:rotate(360deg) scale(1.2);
	-o-transform:rotate(360deg) scale(1.2);
	-ms-transform:rotate(360deg) scale(1.2);
	transform:rotate(360deg) scale(1.2);
}